<template>
	<div class="edit-box">
		<m-header v-if="componentType === type.Header" :componentId="componentId"></m-header>
	</div>
</template>
<script>
import Header from './Header';
import {mapGetters} from "vuex";
export default {
  	name: 'hello',
  	data () {
    	return {
			msg: '这是测试首页',
			type: {
				Header: "Header",
			}
		}
	},
	components: {
        "m-header": Header,
	},
	computed: {
		...mapGetters([
			"editConfig"
		]),
		componentType() {
			console.log("this.editConfig.type", this.editConfig.type);
			return this.editConfig.type;
		},
		//这个值对应的是relGroup;
		componentId() {
			return this.editConfig.id;
		}
	},
	created () {
		
	},
	mounted () {

	},
	components: {
		"m-header": Header,
	}
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
	.edit-box {
         /* display: flex;  */
         /* border: 1px solid blue; */
          height: 500px;
          width: 100%;
		  overflow: scroll;
         /* margin-top: 20px; */
	}
</style>
